{% extends 'workflow/workflowengine/edit/WorkflowSetup.html' %}
{% load i18n common %}
{% block setup_form %}
  <div style="padding: 10px;height: 420px;width: 700px">
    <form class="layui-form action-form setup-form" action="" method="post" >
      {% csrf_token %}
      {% with adminform.form as f %}
        <div class="layui-form-item">
          {% layui_inline f.workflow_code %}
          {% layui_inline f.workflow_name %}
        </div>
        <div class="layui-form-item">
             <div class="layui-inline field-before">
                <label class="layui-form-label"
                       for="id_type">{% trans 'workflowEngine_field_employee' %}</label>
                <div class="layui-input-inline ">
                    <input name="type" id="id_type" lay-filter="id_type" value="" class="layui-input" readonly>
                    <div id="employee_origin">
                        <script>
                            var employee_origin_name = '';
                            var globalEmpSelected = [];
                            {% if f.instance.id %}
                                {% for item in f.instance.employee.all %}
                                    $('#employee_origin').append('<input type="hidden" name="employee" value="{{ item.id }}"/>');
                                    employee_origin_name = '{{ item.emp_code }}' + ',' + employee_origin_name;
                                    var emp_item = {
                                        id: {{ item.id }},
                                        emp_code: '{{ item.emp_code }}',
                                        {% if item.first_name %}
                                            first_name: '{{ item.first_name }}',
                                        {% else %}
                                            first_name: '',
                                        {% endif %}
                                        {% if item.last_name %}
                                            last_name: '{{ item.last_name }}',
                                        {% else %}
                                            last_name: '',
                                        {% endif %}
                                        {% if item.department.dept_name %}
                                            dept_name: '{{ item.department.dept_name }}',
                                        {% else %}
                                            dept_name: '',
                                        {% endif %}
                                    }
                                    globalEmpSelected.push(emp_item)
                                {% endfor %}
                            {% endif %}
                            $('#id_type')[0].value = employee_origin_name;
                        </script>
                    </div>
                </div>
            </div>
            {% layui_inline f.content_type %}
        </div>
        <div class="layui-form-item">
          {% layui_inline f.start_date %}
          {% layui_inline f.end_date %}
        </div>
        <div class="layui-tab">
          <ul class="layui-tab-title">
            <li class="layui-this"><span class="required">*</span>{% trans 'workflow.tabs.workflowSetup' %}</li>
          </ul>
          <div class="layui-tab-content">
            <div class="layui-tab-item layui-show">
              <div id="workflowNodeContainer" class="layui-tab layui-tab-brief" lay-filter="workflow-node"
                   style="width: 680px">
                <a id="addWorkflowNode" href="javascript:void(0);" class="layui-btn" style="float: right;width: 80px;">Add</a>
                <ul id="tab-title-id" class="layui-tab-title" style="margin-right: 80px;"></ul>
                <div id="tab-content-id" class="layui-tab-content" style="height: 120px; padding-top: 20px"></div>
              </div>
            </div>
          </div>
        </div>
        <div class="layui-hide">
          {{ f.node }}
        </div>
      {% endwith %}
       <script>
            layui.use(['table', 'form', 'element', 'layer'], function () {
                 var table = layui.table, layer = layui.layer, form = layui.form;
                $('#id_type').click(function () {
                    if("{{ add }}" == "True"){
                        var company = $('input[name=company]').val();
                        if (company == 'undefined' || company == undefined) {
                            layer.open({
                                time: 1000,
                                content: "{% trans 'company_field_is_required' %}",
                                btn: ['ok'],
                                title: 'Message',
                                icon: 5
                            });
                            returnFalse()
                        }
                    }else{
                        var company = "{{ original.company_id }}";
                    }
                    $.ajax({
                        url: "/personnel/filter_resign_employee/?company=" + company,
                        type: "GET",
                        dataType: "html",
                        success: function (pannel) {
                            layer.open({
                                type: 1,
                                title: "{% trans 'workflowEngine_field_employee' %}",
                                zIndex: 1003,
                                area: ['1080px', '550px'],
                                content: pannel,
                                btn: [gettext("btn_confirm"), gettext("btn_cancel")],
                                success: function (layero, index) {
                                    // 将globalEmpSelected初始化到selected table
                                    for (i = 0; i < globalEmpSelected.length; i++) {
                                        globalEmpSelected[i]['LAY_CHECKED'] = true;
                                    }
                                    var selected_table = table.reload('id-employee-frame-selected', {data: globalEmpSelected});
                                    // 将globalEmpSelected初始化到unselect table
                                    var unselect = table.reload('id-employee-frame-unselect');
                                },
                                yes: function (index, layero) {
                                    var name_val = $('#employeeFrameSelectedDetailContainer').val()
                                    $('#id_type')[0].value = name_val;
                                    $('#employee_origin').html('')
                                    globalEmpSelected = layui.table.checkStatus('id-employee-frame-selected').data;
                                    for (i = 0; i < globalEmpSelected.length; i++) {
                                        $('#employee_origin').append('<input type="hidden" name="employee" value="' + globalEmpSelected[i].id + '"/>');
                                    }
                                    if (globalEmpSelected.length) {
                                        $('#{{ model_name }}_edit_form input[id^="applicant_position"]').attr("disabled", "disabled")
                                        $('#{{ model_name }}_edit_form input[id^="applicant_position"]').attr("value", "")
                                        $('#{{ model_name }}_edit_form input[name^="applicant_position"]').attr("value", "");
                                        $('#{{ model_name }}_edit_form input[id^="departments"]').attr("disabled", "disabled")
                                        $('#{{ model_name }}_edit_form input[id^="departments"]').attr("value", "")
                                        $('#{{ model_name }}_edit_form input[name^="departments"]').attr("value", "");
                                    } else {
                                        $('#{{ model_name }}_edit_form input[id^="applicant_position"]').removeAttr("disabled")
                                        $('#{{ model_name }}_edit_form input[id^="departments"]').removeAttr("disabled")
                                    }
                                    layer.close(index)
                                }
                            });
                        },
                        error: function (response) {
                            console.log(response.responseText);
                        }
                    })
                });
            });
        </script>
    </form>
  </div>
{% endblock %}